Remove link underline effect on hover for Link and Button variant link#7676
Remove link underline effect on hover for Link and Button variant link#7676
Conversation
Co-authored-by: HiroAgustin <1458873+HiroAgustin@users.noreply.github.com>
🦋 Changeset detectedLatest commit: 2bb322c The changes in this PR will be included in the next version bump. This PR includes changesets to release 1 package
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
HiroAgustin
added
the
update snapshots
github-actions
bot
added
the
integration-tests: recommended
|
github-actions
bot
removed
the
update snapshots
There was a problem hiding this comment.
Pull request overview
This PR updates link-underlining behavior when the data-a11y-link-underlines="true" preference is enabled, and refreshes VRT snapshots to match.
Changes:
- Adjust
Link(inline) underline styling under the a11y underline preference, including hover behavior. - Adjust
Buttonvariant="link"underline styling under the a11y underline preference (notably thedata-no-visualscase). - Update Playwright visual snapshots and add a patch changeset.
Reviewed changes
Copilot reviewed 3 out of 21 changed files in this pull request and generated 2 comments.
| File | Description |
|---|---|
| packages/react/src/Link/Link.module.css | Adds hover override under a11y underline preference for inline links |
| packages/react/src/Button/ButtonBase.module.css | Adds hover override under a11y underline preference for link-variant buttons with data-no-visuals |
| .playwright/snapshots/components/Link.test.ts-snapshots/* | Updates VRT baselines for link hover/focus states across themes/modes |
| .changeset/remove-link-underline-on-hover.md | Declares a patch release note for the styling change |
You can also share your feedback on Copilot code review. Take the survey.
|
Validated on deployed storybook: Screen.Recording.2026-03-18.at.14.45.57.movScreen.Recording.2026-03-18.at.14.46.15.mov |
|
👋 Hi from github/github-ui! Your integration PR is ready: https://github.com/github/github-ui/pull/16539 |
lukasoppermann
left a comment
lukasoppermann
left a comment
There was a problem hiding this comment.
LGTM from a visual perspective
&:hover { text-decoration: none; }under&[data-no-visuals]in ButtonBase.module.css&:hover { text-decoration: none; }under[data-a11y-link-underlines='true'] &:where([data-inline='true'])in Link.module.cssupdate snapshotslabel (noted in PR description — requires maintainer to add)✨ Let Copilot coding agent set things up for you — coding agent works faster and does higher quality work when set up for your repo.